<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css"/>
    <script type="text/javascript" src="jquery-1.11.3.js"></script>
    <script type="text/javascript" src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</head>
<body>
<!--一般输入框的示例。。。。前后加入span 可以设置固定的内容。-->
<div class="input-group">
    <span class="input-group-addon" id="basic-addon1">@</span>
    <input type="text" class="form-control" placeholder="Username" aria-labelledby="basic-addon1"/>
</div>

<!--前面设置单选框或多选框到输入框中去-->
<div class="row">
    <div class="col-lg-6">
        <div class="input-group">
            <span class="input-group-addon">
                <!--<input type="checkbox" aria-label="..."/>-->
                <select name="sex" >
                    <option value="男">男</option>
                    <option value="女">女</option>
                </select>
            </span>
            <input type="text" class="form-control" aria-label=".."/>
        </div>
    </div>
    <div class="col-lg-6">
        <div class="input-group">
            <span class="input-group-addon">
                <input type="radio" name="sex"  aria-label="..."/>男
                <input type="radio" name="sex" aria-label="..."/>女
            </span>
            <input type="text" class="form-control" aria-label="..."/>
        </div>
    </div>
</div>

<!--增加一个额外的下拉菜单到输入框中去-->
<div class="row">
    <div class="col-lg-6">
        <div class="input-group">
            <div class="input-group-btn">
                <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown">
                    下拉 <span class="caret"></span>
                </button>
                <ul class="dropdown-menu">
                    <li><a href="#">下拉1</a></li>
                    <li><a href="#">下拉2</a></li>
                    <li><a href="#">下拉3</a></li>
                </ul>
            </div>
            <input type="text" class="form-control" aria-label="..."/>
        </div>
    </div>
</div>
</body>
</html>